// @ 516
// _(:з」∠)_
// 灾害详情

define([ ], function() {
    'use strict';

    let disDetilas = {
        'init': function( param ) {
            let _this = this;

            RST.basic(
                _this.getRequestUrl({
                    type_: param.disModel,
                    disArea: param.disArea,
                    disCrop: param.disCrop,
                    disDate: param.disDate,
                    disType: param.disType,
                    disModel: param.disModel
                }), "",
            function( reuslt ) {
                if ( reuslt.data ) {
                    _this.initInfo({
                        type: param.type,
                        data: reuslt.data,
                        disModel: param.disModel,
                        insetElmt: param.insetElmt
                    });
                } else {
                    param.insetElmt.insertAdjacentHTML("beforeEnd", `<p class="noData">未获取到相关数据信息</p>`);
                }
            });
        },
        'initInfo': function( param ) { // 初始化灾害信息
            let _this = this,
                thisView = ``,
                detailItem = ``;

            if ( param.disModel == "T1" ) detailItem = `<li> <h>受灾面积:</h> <span>${ param.data.totalArea * 100  } hm² (公顷)</span> </li>`;
            if ( param.disModel == "T2" ) detailItem = `<li> <h>受灾面积:</h> <span>${ param.data.totalArea * 100  } hm² (公顷)</span> </li>`;
            if ( param.disModel == "T3" ) detailItem = `<li> <h>受灾损失率:</h> <span>${ param.data.totalLoss  } % (损失率)</span> </li>`;

            thisView += `<div class="dis_info">
                                    <div class="rightInfo_head">受灾基本信息</div>
                                    <ul class="dis_info_list">
                                        <li> <h>受灾区域:</h> <span>${ param.data.areaName }</span> </li>
                                        <li> <h>受灾作物:</h> <span>${ param.data.cropNameCN }</span> </li>
                                        <li> <h>受灾类型:</h> <span>${ param.data.disasterName }</span> </li>
                                        ${ detailItem }
                                        <li> <h>受灾时序:</h> <span>${ param.data.disasterDate }</span> </li>
                                    </ul>
                                </div>`;

            param.insetElmt.insertAdjacentHTML("beforeEnd", thisView);

            if ( param.type == "area" && param.data.detail.length > 0 ) _this.initInfos( param );
        },
        'initInfos': function( param ) {
            let _this = this,
                thisView = ``;

            thisView += `<div class="dis_infos">
                                    <div class="rightInfo_head">受灾详情信息</div>
                                    <div class="dis_infos_box">
                                        <div class="dis_infos_head">
                                            <div class="selectElmt">
                                                <h>省级</h>
                                                <div name="select" class="province">
                                                    <h></h> <ul></ul>
                                                </div>
                                            </div>
                                            <div class="selectElmt">
                                                <h>州市</h>
                                                <div name="select" class="city">
                                                    <h></h> <ul></ul>
                                                </div>
                                            </div>
                                            <div class="selectElmt">
                                                <h>区县</h>
                                                <div name="select" class="cnty">
                                                    <h></h> <ul></ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="dis_infos_cont">
                                            <div class="dis_chart">
                                                <div id="disInfos_chart"></div>
                                            </div>
                                            <div class="dis_table">
                                                <div id="disInfos_table"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>`;

            param.insetElmt.insertAdjacentHTML("beforeEnd", thisView);

            _this.initSelect( param );
        },
        'initSelect': function( param ) { // 初始化select
            let _this = this,
                province = param.insetElmt.querySelector("div[name='select'].province"),
                city = param.insetElmt.querySelector("div[name='select'].city"),
                cnty = param.insetElmt.querySelector("div[name='select'].cnty");

            // 初始化对应数据
            Elmt.select({
                elmt: province,
                data: _this.getNewData({
                    type: "select", type_: "province",
                    data: param.data.detail
                })
            });

            Elmt.select({
                elmt: city,
                data: _this.getNewData({
                    type: "select", type_: "city", data: []
                })
            });

            Elmt.select({
                elmt: cnty,
                data: _this.getNewData({
                    type: "select", type_: "cnty", data: []
                })
            });

            _this.initChart( param );
            _this.initTable( param );

            // 监听select事件
            _this.listenerSelect({
                elmt: province.querySelector("h"),
                callBack: function( e ) {
                    let pValue = e.target.getAttribute("value");

                    if ( pValue != -1 ) {
                        city.parentNode.show();
                    } else { city.parentNode.hide(); }

                    Elmt.select({
                        elmt: city,
                        type: 'reset',
                        data: _this.getNewData({
                            type: "select", type_: "city",
                            data: param.data.detail,
                            value: pValue
                        })
                    });
                }
            });

            _this.listenerSelect({
                elmt: city.querySelector("h"),
                callBack: function( e ) {
                    let pValue = e.target.getAttribute("value");

                    if ( pValue != -1 ) {
                        cnty.parentNode.show();
                    } else { cnty.parentNode.hide(); }

                    Elmt.select({
                        elmt: cnty,
                        type: 'reset',
                        data: _this.getNewData({
                            type: "select", type_: "cnty",
                            data: param.data.detail,
                            value: pValue
                        })
                    });
                }
            });
        },
        'initChart': function( param ) { // 初始化chart
            let _this = this,
                option = null, category = [], seriesData = [],
                disInfos_chart = param.insetElmt.querySelector("#disInfos_chart");

            Chartx.dis_echarts({ elmt: disInfos_chart, yAxis: "公顷(hm²)" });
        
            option = Chartx.chartArry.disInfos_chart.getOption();

            seriesData = _this.getNewData({
                type: "chart", type_: "province",
                data: param.data.detail, value: "轻度"
            });
            category = category.concat( seriesData.category );
            option.series[0].data = seriesData.series;
            seriesData = [];

            seriesData = _this.getNewData({
                type: "chart", type_: "province",
                data: param.data.detail, value: "中度"
            });
            category = category.concat( seriesData.category );
            option.series[1].data = seriesData.series;
            seriesData = [];

            seriesData = _this.getNewData({
                type: "chart", type_: "province",
                data: param.data.detail, value: "重度"
            });
            category = category.concat( seriesData.category );
            option.series[2].data = seriesData.series;
            seriesData = [];

            option.xAxis[0].data = toHeavy( category );

            Chartx.chartArry.disInfos_chart.setOption( option );
            option = null;
        },
        'initTable': function( param ) { // 初始化table
            let _this = this,
                tablePage = false,
                dataDetail = param.data.detail,
                disTable = param.insetElmt.querySelector("#disInfos_table"),
                elmtWidth = disTable.parentNode.clientWidth,
                elmtHeight = 10 * 24 + 30;
            
            if ( dataDetail.length > 10 ) tablePage = true;

            // 处理数据组合
            let newData = [], columns = [], colHeaders = [],
                singleData = objToHeavy( dataDetail, "fullAdminName" );

            for ( let x = 0; x < singleData.length; x++ ) {
                for ( let y = 0; y < dataDetail.length; y++ ) {
                    if ( dataDetail[y].fullAdminName == singleData[x].fullAdminName ) {
                        newData.push( dataDetail[y] );
                    }
                }
            }

            if ( param.disModel == "T3" ) {
                columns = [
                    { data: 'fullAdminName', type: 'text', width: ( elmtWidth * 0.6 ), className: 'htMiddle trOne', editor: false },
                    { data: 'cropNameCN', type: 'text', width: ( elmtWidth * 0.2 ), className: 'htCenter htMiddle', editor: false },
                    { data: 'disasterLoss', type: 'numeric', width: ( elmtWidth * 0.2 ), className: 'htCenter htMiddle', editor: false,
                        numericFormat: { pattern: '0' }
                    }
                ];

                colHeaders = [ '区县', '作物', '损失率(%)' ];
            } else {
                // 处理数据单位变化
                for ( let x = 0; x < newData.length; x++ ) {
                    newData[x].disasterArea = newData[x].disasterArea * 100;
                }
                
                columns = [
                    { data: 'fullAdminName', type: 'text', width: ( elmtWidth * 0.48 ), className: 'htMiddle trOne', editor: false },
                    { data: 'cropNameCN', type: 'text', width: ( elmtWidth * 0.18 ), className: 'htCenter htMiddle', editor: false },
                    { data: 'disasterLevelName', type: 'text', width: ( elmtWidth * 0.14 ), className: 'htCenter htMiddle', editor: false },
                    { data: 'disasterArea', type: 'numeric', width: ( elmtWidth * 0.2 ), className: 'htCenter htMiddle', editor: false,
                        numericFormat: { pattern: '0' }
                    }
                ];

                colHeaders = [ '区县', '作物', '程度', '面积(hm²)' ];
            }

            Tablex.singleTable({
                elmt: disTable,
                option: {
                    data: newData,
                    width: elmtWidth,
                    height: elmtHeight,
                    columns: columns,
                    stretchH: 'all',
                    fillHandle: false,
                    rowHeaders: false,
                    autoWrapRow: true,
                    colHeaders: colHeaders
                },
                tablePage: tablePage
            });

            param.insetElmt.querySelector("#hot-display-license-info").remove();
        },
        'getNewData': function( param ) {
            let _this = this,
                data = param.data,
                newData = [{ "id": -1, "name": '全部', "value": -1 }];

            if ( data.length < 1 ) return newData;

            switch( param.type ) {
                case "select":
                    data.forEach( ( item, index ) => {
                        if ( param.type_ == "province" ) {
                            newData.push({ "id": index, "name": item[param.type_], "value": item[param.type_] });
                        } else {
                            if ( item[param.type_] == param.value && param.value != -1 ) {
                                newData.push({ "id": index, "name": item[param.type_], "value": item[param.type_] });
                            } else if ( param.value == -1 ) {
                                newData.push({ "id": index, "name": item[param.type_], "value": item[param.type_] });
                            }
                        }
                    });
                break;
                case "chart":
                    newData = null;
                    newData = { category: [], series: [] };

                    data.forEach( ( item ) => {
                        if ( item.disasterLevelName == param.value ) {
                            newData.category.push( item[param.type_] );
                            newData.series.push( item.disasterArea * 100 );
                        }
                    });
                break;
            }

            if ( typeof( newData ) == "object" ) {
                if ( newData["category"] ) {
                    newData["category"] = toHeavy( newData["category"] );
                } else if ( newData[0]['name'] ) {
                    newData = objToHeavy( newData, 'name' );
                } else if ( newData.length == "number" ) {
                    newData = toHeavy( newData );
                }
            }

            return newData;
        },
        'listenerSelect': function( param ) {
            let _this = this;

            let observer = new MutationObserver( function( mutations ) {
                mutations.forEach(function( mutation ) {
                    if ( mutation.type == "attributes" ) {
                        param.callBack( mutation );
                    }
                });
            });
            
            observer.observe( param.elmt, { attributes: true });
        },
        'getRequestUrl': function( param ) {
            let _this = this,
                thisUrl = NetWorkPath,
                timeLineItem = document.querySelector(".timeLine .select");

            switch( param.type_ ) {
                case "T1":
                    thisUrl += `/disaster/getDisasterEventDetail?`;
                    thisUrl += `disasterArea=${ param.disArea }&cropName=${ param.disCrop }&disasterType=${ param.disType }&modelValue=${ param.disModel }&disasterDate=${ timeLineItem.getAttribute("time") }`;
                break;
                case "T2":
                    thisUrl += `/disaster/getDisasterEventDetailByEventId?`;
                    thisUrl += `disasterArea=${ param.disArea }&cropName=${ param.disCrop }&eventId=${ param.disEvent }&modelValue=${ param.disModel }&disasterType=${ param.disType }`;
                break;
                case "T3":
                    thisUrl += `/disaster/getDisasterEventDetailByEventId?`;
                    thisUrl += `disasterArea=${ param.disArea }&cropName=${ param.disCrop }&eventId=${ param.disEvent }&modelValue=${ param.disModel }&disasterType=${ param.disType }`;
                break;
                case "Table":
                    thisUrl += ``;
                break;
            }

            return thisUrl;
        }
    };

    return disDetilas;
});